.px2rem(@name, @px){
    @{name}: @px / 75 * 1rem;
}
.Flex{
    display:flex;
}
.line-height(@arg){.px2rem(line-height, @arg);}
.font-size(@arg){.px2rem(font-size, @arg);}
.font(@fz,@color){
    .px2rem(font-size,@fz);
    color: @color;
}
.border-bottom(@px,@xian,@color){
    .px2rem(border-bottom-width,@px);
    border-bottom-style: @xian;
    border-bottom-color: @color;
}
.border-top(@px,@xian,@color){
    .px2rem(border-top-width,@px);
    border-top-style: @xian;
    border-top-color: @color;
}
.border(@px,@xian,@color){.px2rem(border-width,@px);border-style: @xian; border-color: @color;}
.padding-top(@top){.px2rem(padding-top, @top);}
.padding-right(@right){.px2rem(padding-right, @right);}
.padding-bottom(@bottom){.px2rem(padding-bottom, @bottom);}
.padding-left(@left){.px2rem(padding-left, @left);}
.padding(@top,@right,@bottom,@left){
   .px2rem(padding-top,@top);
   .px2rem(padding-bottom,@bottom);
   .px2rem(padding-right,@right);
   .px2rem(padding-left,@left);
}
.margin-top(@top){.px2rem(margin-top, @top);}
.margin-right(@right){.px2rem(margin-right, @right);}
.margin-bottom(@bottom){.px2rem(margin-bottom, @bottom);}
.margin-left(@left){.px2rem(margin-left, @left);}
.margin(@top,@right,@bottom,@left){
   .px2rem(margin-top,@top);
   .px2rem(margin-right,@right);
   .px2rem(margin-bottom,@bottom);
   .px2rem(margin-left,@left);
}
html,body{
  width:100%;
  height:100%;
  background:#eff3f2;
}
header{
  width: 100%;
  .px2rem(height,88);
  background: url(../imgs/Reg_serve_bg01.jpg);
  .Flex;
   align-items: center;

  .Login_to_index{
    flex:1;
    padding-left:2%;
    img{
      display:block;
      .px2rem(width,55);
      .px2rem(height,53);
    }
  }
  .flex2{
    flex:4;
    .px2rem(font-size,37);
  }
  .flex3{
    flex:1;
    .px2rem(font-size,30);
  }
}
main{
  background:#ffffff;
  padding: 0 2%;
  
  .margin-top(20);
  .font-size(30);
}
.center{
  article{
    border-bottom: 1px solid #ccc;
  }
    .tou{
        .Flex;
        .padding-top(15);
        justify-content:space-between;
        align-items:center;
        .padding-bottom(20);
        div{
          .Flex;
          align-items:center;
            .tt{
                .px2rem(width,102);
               .px2rem(height,105);
               .margin-right(30); 
            }
            p{
              
              .tc{
               .px2rem(width,71);
               .px2rem(height,51);
               display:block;
               .margin-right(30);
            }
            }
            
          }
    }
    .nict{
      .padding-top(30);
      .padding-bottom(30);
        .Flex;
        justify-content:space-between;
        align-items:center;
        input{
          border:none;
          text-align: center;
          .px2rem(width,200);
        }
    }
}
.c2{
   .margin-top(20);
}
footer{
  .font-size(30);
  background:#ffffff;
  padding: 0 2%;
}
@keyframes show {
  0% {background-color: rgba(0,0,0,0) }
  100% {background-color: rgba(0,0,0,0.5) }
}
.model{
  display:none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
   //background:rgba(125, 125, 125,0.5);
   animation: show 1s forwards;
    .cont{
      width:100%;
        position:absolute;
        .px2rem(bottom,-400);
        background:#ffffff;
        .tet{
           border-bottom: 1px solid #ccc;
           padding:3% 4%;
           .Flex;
           .font-size(30);
           align-items:center;
           img{
               .px2rem(width,71);
               .px2rem(height,51);
               
            }
            .text{
              .margin-left(20);
            }
        }
       

    }
}


.moT{
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    animation: show 1s forwards;
    .cancle{
        position:absolute;
        color: blue;
        background:#ffffff;
        text-align:center;
        .px2rem(bottom,20);
        width:94%;
        .margin-left(20);
        .font-size(30);
        .px2rem(border-radius,20);
        .padding-top(20);
       .padding-bottom(20);
    }
    .tiao{
       .padding-top(20);
       .padding-bottom(20);
       color: blue;
        position:absolute;
        .px2rem(bottom,120);//
        width:94%;
        .margin-left(20);
        background:#ffffff;
        text-align:center;
        .font-size(30);
        .px2rem(border-radius,20);
        p{
          border-bottom:1px solid #ccc;
          .padding-bottom(20);
          .margin-bottom(20);
        }
    }
    .file {
        position: relative;
        display: inline-block;
        
        .padding(4,4,12,12);
        overflow: hidden;
        text-decoration: none;
        text-indent: 0;
        .line-height(20);
        input {
          position: absolute;
          
          right: 0;
          top: 0;
          opacity: 0;
        }
       .file:hover {
          background: #AADFFD;
          border-color: #78C3F3;
          text-decoration: none;
        }    
    }
}




